<template>
  <div class="custom-label">
    <span>{{ label }}</span>
    <van-icon :name="icon" v-if="icon" @click.stop="clickIconEvt" />
  </div>
</template>

<script lang="ts" setup>
import { defineProps, defineEmits } from 'vue'

const props = defineProps({
  // 标题
  label: {
    type: String,
    required: true
  },
  // 额外的icon
  icon: {
    type: String,
  }
})

const emit = defineEmits(['click'])

// 点击icon
const clickIconEvt = () => {
  emit('click')
}

</script>

<style scoped>
.custom-label {
  display: flex;
  align-items: center;
}

.custom-label span {
  margin-right: 8px;
}
</style>